<template>
  <div class="nav">
    <!-- {{globalStore.state.showTabBar}} -->
    <van-nav-bar title="">
      <template #left>
        <van-image v-if="globalStore.state.showTabBar" @click="leftClick" class="icon" round src="./src/assets/logo.ico"></van-image>
        <van-icon v-else @click="back()" class="icon1" name="arrow-left" />
      </template>
      <template v-if="!userStore.state.token" #right>
        <van-icon @click="rightClick" name="https://b.yzcdn.cn/vant/icon-demo-1126.png" size="24" />
      </template>
    </van-nav-bar>
  </div>
  <van-nav-bar title=""></van-nav-bar>
</template>

<script>
  import tab_pages from '../../utils/constant/tab_pages.js'
  import {userStore} from '../../store/user.js'
  import {globalStore} from '../../store/globalStore.js'
  
  import {
    computed,
    defineComponent,
    ref,
    toRefs,
    onMounted,
    reactive,
    watch,
    getCurrentInstance,
  } from "vue";

  export default defineComponent({
    setup(props) {
      const { proxy } = getCurrentInstance();
      const data = reactive({
      });
     
      const leftClick = () =>{
        proxy.$router.push("/home")
      }
      const rightClick = () =>{
        proxy.$router.push("/login")
      }
      const back = () => {
        proxy.$router.back()
      }
      return {
        ...toRefs(data),
        userStore,
        globalStore,
        leftClick,
        rightClick,
        back
      };
    },
  });
</script>
<style scoped lang='less'>
  .nav {
    position: fixed;
    left: 0;
    top: 0;
    width: 100%;
    z-index: 111111;
    .icon {
      width: 60px;
      height: 60px;
    }
  }
</style>
<style lang='less'>
</style>